<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
    <title>约车</title>
    <script th:src="@{js/jquery.min.js}"></script>
    <script th:src="@{js/coordinate.js}"></script>
    <style type="text/css">
    body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
    #container {width: 100%;height: 70%;margin:0;font-family:"微软雅黑";}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=MLy2Xs1D6csnuwORcntVO6y8swoPnQ8R"></script>

</head>
<body>

<div id="container"></div>

<form id="form">

    <div id="r-result1">起点:<input type="text" id="suggestId1" size="20" value="" style="width:150px;"/></div>
    <div id="searchResultPanel1" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>

    <div id="r-result">终点:<input type="text" id="suggestId" size="20" value="" style="width:150px;"/></div>
    <div id="searchResultPanel" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
    <button onclick="search()"></button>
    <input type="submit" value="确认发布">
</form>




</body>
<script>
    $(function () {
       // showPosition();
        initMap();
    });


    function showPosition(position) {
        var geolocation = new BMap.Geolocation();
        // 开启SDK辅助定位
        geolocation.enableSDKLocation();
        geolocation.getCurrentPosition(function (r) {
            var myGeo = new BMap.Geocoder();
            myGeo.getLocation(new BMap.Point(r.point.lng, r.point.lat), function (result) {
                if (result) {
                    $('#startPoint').val(result.address + result.surroundingPois[0].title);
                    $('#address').html(result.address + result.surroundingPois[0].title)
                } else {
                    alert("定位失败，请手动输入地址")
                }
            });

        });
    }

    //加载地图
    function initMap() {
        var map = new BMap.Map("container");
        map.centerAndZoom("重庆", 12); // 初始化地图,设置城市和地图级别。

        var ac = new BMap.Autocomplete( //建立一个自动完成的对象
            {
                "input": "suggestId",
                "location": map
            });

        var myValue;
        ac.addEventListener("onconfirm", function (e) { //鼠标点击下拉列表后的事件
            var _value = e.item.value;
            myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
            G("searchResultPanel").innerHTML = "onconfirm<br/>index = " + e.item.index + "<br/>myValue = " + myValue;
        });

        var ac1 = new BMap.Autocomplete( //建立一个自动完成的对象
            {
                "input": "suggestId1",
                "location": map
            });

        var myValue1;
        ac1.addEventListener("onconfirm", function (e) { //鼠标点击下拉列表后的事件
            var _value = e.item.value;
            myValue1 = _value.province + _value.city + _value.district + _value.street + _value.business;
            G("searchResultPanel1").innerHTML = "onconfirm<br/>index = " + e.item.index + "<br/>myValue1 = " + myValue1;
        });
    }
    function search(){

    }
</script>
</html>